<!--
 * @LastEditors: yuSeen
 * @LastEditTime: 2021-12-24 10:52:56
-->
<template>
    <div class="navTitle">
        <span @click="to">{{ props.title }}</span>
        <SvgIcon name="next-icon" class="svgAutoFill" :size="17" @click="to"></SvgIcon>
    </div>
</template>

<script lang='ts' setup>
import { useRouter } from 'vue-router'
import SvgIcon from '@/components/svgIcon/svgIcon.vue';

const props = defineProps<
    {
        title: string
        to?: string
    }>()

const router = useRouter()
// 跳转
const to = () => {
    if(!props.to) return;
    router.push(props.to)
}

</script>

<style scoped lang='scss'>
.navTitle {
    @apply flex w-full items-center h-7 font-bold text-xl mr-2 my-3 lg:max-w-5xl;
    color: $main-text-color;
}
</style>